<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<c:set var="path" value="${pageContext.request.contextPath }" />
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<!-- 视口标签 -->
<meta name="viewport"
	content="width=device-width, initial-scale=1, user-scalable=no" />
<!-- 删除苹果默认的工具栏和菜单栏 -->
<meta name="apple-mobile-web-app-capable" content="yes" />
<!-- 设置苹果工具栏颜色 -->
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<!-- 忽略页面中的数字识别为电话，忽略email识别 -->
<meta name="format-detection" content="telphone=no, email=no" />
<!-- 启用360浏览器的极速模式(webkit) -->
<meta name="renderer" content="webkit">
<!-- 避免IE使用兼容模式 -->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!-- 针对手持设备优化，主要是针对一些老的不识别viewport的浏览器，比如黑莓 -->
<meta name="HandheldFriendly" content="true">
<!-- 微软的老式浏览器 -->
<meta name="MobileOptimized" content="320">
<!-- uc强制竖屏 -->
<meta name="screen-orientation" content="portrait">
<!-- QQ强制竖屏 -->
<meta name="x5-orientation" content="portrait">
<!-- UC应用模式 -->
<meta name="browsermode" content="application">
<!-- QQ应用模式 -->
<meta name="x5-page-mode" content="app">
<!-- windows phone 点击无高光 -->
<meta name="msapplication-tap-highlight" content="no">
<!-- 适应移动端end -->
<link rel="stylesheet" type="text/css"
	href="${path }/resource/css/base.css" />
<link rel="stylesheet" type="text/css"
	href="${path }/resource/css/index.css" />
<script type="text/javascript"
	src="${path }/resource/js/plugin/jquery-2.1.4.min.js"></script>
<script type="text/javascript"
	src="${path }/resource/js/plugin/TouchSlide.1.1.js"></script>
<title>作品详情</title>
<style>
body {
	background: #fff;
}
</style>
</head>
<body>
	<div class="wrap">
		<section
			style="border-width: 0px; border-style: none; border-color: initial; box-sizing: border-box; padding: 10px;">
			<section
				style="font-size: 15px; border-width: 1px; border-style: solid; border-color: rgb(198, 198, 199); padding: 5px; min-height: auto; color: inherit; box-sizing: border-box;">
				<section
					style="border-width: 0px; border-style: initial; border-color: rgb(198, 198, 199); box-sizing: border-box; width: 100%; clear: both; overflow: hidden; color: inherit;"
					data-width="100%">
					<section class=""
						style="box-sizing: border-box; width: 50%; float: left; padding-top: 0.1px; padding-right: 0.1em; color: inherit;"
						data-width="50%">
						<img border="0" data-ratio="1.28125"
							data-src="http://mmbiz.qpic.cn/mmbiz_png/X3vkrjeW7KuBZUmQRiav5Nvurv0ibcD7gxJBS1sXIVxjt2yrPiaRkKicSk6xRtBUCFwPLuRCyhJGicfmpCiag5G7TAcw/0?wx_fmt=png"
							data-type="png" data-w="480" data-width="100%" height="auto"
							style="box-sizing: border-box; color: inherit; visibility: visible !important; width: auto !important; height: auto !important;"
							title="undefined" width="100%" class=""
							src="${work.desHeadimgurl}" data-fail="0">
					</section>
					<section class=""
						style="display: inline-block; width: 50%; box-sizing: border-box; float: left; padding-left: 1em; color: inherit;"
						data-width="50%">
						<section
							style="margin-right: 0.5px; padding-top: 10px; padding-right: 3px; padding-left: 3px; font-size: 1.2em; font-weight: bold; color: rgb(70, 70, 72); box-sizing: border-box;">
							<span class="" data-brushtype="text" style="color: inherit;">${work.desName}</span>
						</section>
						<section
							style="box-sizing: border-box; margin-right: 0em; padding: 0.1em 0.3em; color: rgb(70, 70, 72); font-size: 0.9em;">
							<span style="color: rgb(214, 214, 214);">${work.desRemark}</span>
						</section>
						<p style="color: rgb(70, 70, 72); line-height: 0.5em;">
							<br>
						</p>
						<p
							style="padding-top: 5px; padding-bottom: 5px; font-size: 14px; line-height: 1em; letter-spacing: 0px; color: rgb(61, 61, 61); text-indent: 0em; white-space: normal;">
							<span style="color: #0C0C0C; font-size: 12px;">工作室：${work.desStudio}</span>
						</p>
						<p
							style="padding-top: 5px; padding-bottom: 5px; font-size: 14px; line-height: 1em; letter-spacing: 0px; color: rgb(61, 61, 61); text-indent: 0em; white-space: normal;">
							<span style="color: #0C0C0C; font-size: 12px;">设计价格：${work.desPrice}元/平方米</span>
						</p>
						<c:if test="${work.isShowTel eq 'on'}">
						<p
							style="padding-top: 5px; padding-bottom: 5px; font-size: 14px; line-height: 1em; letter-spacing: 0px; color: rgb(61, 61, 61); text-indent: 0em; white-space: normal;">
							<span style="color: #0C0C0C; font-size: 12px;">联系方式：${work.desAccount}</span>
						</p>
						</c:if>
						<p style="color: rgb(70, 70, 72); line-height: 0.5em;">
							<br>
						</p>
					</section>
				</section>
			</section>
		</section>
		<!-- 		<section class="pro_detail_bg"> -->
		<!-- 			<div class="pro_detail_gr"> -->
		<%-- 				<img src="${work.desHeadimgurl}" style="margin-bottom: 10px;" --%>
		<!-- 					class="pro_gr bor" alt="" /> -->
		<%-- 				<p>${work.desName}</p> --%>
		<%-- 				<p>${work.desRemark}</p> --%>
		<!-- 			</div> -->
		<!-- 		</section> -->
		<div class="detail_txt">
			<h1>${work.workTitle}</h1>
			<pre
				style="word-break: break-all; word-wrap: break-word; line-height: 1.6rem; color: #999; margin: 0">${work.workDescription}</pre>
		</div>
		<ul class="show_list">
			<c:forEach var="img" items="${ fn:split(work.workImgs, ';') }">
				<li><img src="${img}" width="100%" alt="" /></li>
			</c:forEach>
		</ul>
		<!-- 扫描关注二维码 -->
		<section style="padding: 1.2rem;">
			<img src="${path }/resource/images/wx_qrcode.png" alt="二维码" />
		</section>
	</div>
</body>
</html>